<template>
	<div id="visit_record" class="dialog animated" :class="open? 'fadeIn':'fadeOut'" v-show="show">
		<div class="panel animated" :class="open? 'zoomIn':''">
			<div class="title">
				创建教室
				<div class="close" @click="cancel()"></div>
			</div>
			<div class="form">
				<div style="overflow: hidden;">
					<div class="create_btn" @click="createRoomBatch()">创建网络教室</div>
				</div>
				<table class="table" cellspacing="0">
					<thead class="thead">
						<tr>
							<td style="width: 3.5rem;">上课时间</td>
							<td style="width: 2rem;">班级状态</td>
							<td style="width: 2rem;">授课老师</td>
							<td style="width: 2rem;">操作</td>
						</tr>
					</thead>
					<tbody class="tbody">
						<tr v-for="item in syllabusList">
							<td>{{item.time}}</td>
							<td>{{item.status}}</td>
		  					<td>{{item.teacherUserName}}</td>
		  					<td>
		  						<template v-if="item.talkcloudRoomId">
			  						<img class="created_img" src="../../../assets/img/education_manage/success_create.png" />
			  						<span class="span_btn">已创建教室</span>
		  						</template>
		  						<template v-else>
		  							<span class="span_btn" @click="createRoom(item)">
		  								&nbsp;&nbsp;创建教室
		  							</span>
		  						</template>
		  					</td>
		  				</tr>
					</tbody>
				</table>
			</div>
		</div>
	</div>
</template>

<script>
var vm,dict;
export default {
	data : function() {
		return {
			show : false,
			open : false,
			param : {
				classId : null,
				classType : 2
			},
			audition : {},
			syllabusList : null,
			statusMap : null
		}
	},
	methods : {
		init : function(audition) {
			vm.show = true;
			vm.open = true;
			
			vm.audition = audition;
			
			vm.param.classId = audition.classId;
			
			api.auditionSyllabus({classId : audition.classId}).then(function(data) {
				var now = tool.DateToString(new Date(), "yyyy-MM-dd HH:mm");
				
				data.list.forEach(function(s) {
					//获取日期,星期,时间
					var day = s.startTime.substring(0, 10);
					var week = tool.getWeek(day);
					var time = s.startTime.substring(11, 16) + "~" +  s.endTime.substring(11, 16);
					//赋值到课节对象
					s.time = day + " " + week + " " + time; 
					
					//没最近课节,未排课,需求说就叫待上课
					if(now < s.startTime) {
						s.status = vm.statusMap[2];
					//最近课节已经结束,已结课
					} else if(now >= s.endTime) {
						s.status = vm.statusMap[4];
					//上课中
					} else {
						s.status = vm.statusMap[3];
					}
				});
				vm.syllabusList = data.list;
			})
		},
		cancel : function() {
			vm.open = false;
			setTimeout(function() {
				vm.show = false;
			},500);
		},
		createRoom : function(syllabus) {
			let p1 = {
				classSyllabusId : syllabus.classSyllabusId,
				isTrialClass : 1
			};
			api.createTalkyunRoom(p1).then(function(data) {
				//创建成功,给课节赋上临时教室id,好改变列表的状态,不需要重新查询
				syllabus.talkcloudRoomId = 1;
				tool.message({message: "创建网络教室成功", type: "success", showClose: true});
				
				//查询资源(不要提前查询,防止被更新了)
//				let p2 = {
//					classId : vm.audition.classId,
//					classType : 2
//				};
				//return api.auditionFileList(p2);
				
			})
//			.then(function(data) {
//				let p3 = {
//					classType : 2,
//					classSyllabusIdList : [syllabus.classSyllabusId],
//					talkcloudClassFileEntityList : data.list
//				};
//				//将资源和当前的课节绑定
//				return api.auditionSyllabusFileBind(p3);
//				
//			}).then(function(data) {
//				
//			})
		},
		createRoomBatch : function() {
			let param = {
				classId: vm.audition.classId,
				isTrialClass: 1
			};
			api.createTalkRoomByClassId(param).then(function(data) {
				//创建成功,给课节赋上临时教室id,好改变列表的状态,不需要重新查询
				vm.syllabusList.forEach(function(item) {
					item.talkcloudRoomId = 1;
				});
				tool.message({message: "创建网络教室成功", type: "success", showClose: true});
			})
		}
	},
	mounted : function() {
		
//		vm.init({"classId":"1154639680981975042","classNo":"20190726726XSCS2","className":"726线上测试2","coursePackageId":"1152425842668740611","coursePackageName":"小小书法家","photo":"","totalCourseHour":50,"oneCourseHour":1,"oneCourseHourMinute":50,"recruitNum":50,"startTime":"2019-07-26 00:00","endTime":"2019-08-30 00:00","teacherUserId":"1146251414579093505","assisUserId":"1146611851405041666","classRoomId":"0","classStatusMode":1,"classTypeMode":2,"classTeachingMode":1,"classReplayMode":1,"syllabusStartNum":1,"syllabusEndNum":1,"feiboClassOrderId":null,"campusId":"1130711493383290882","createUserId":"1133708803179556866","createUserName":"余小获","createTime":"2019-07-26 14:28","updateTime":"2019-07-26 14:28","updateUserId":"1133708803179556866","isDelete":"0","courseName":"小小书法家","courseId":"1152425842630991874","teacherUserName":"dks","assisUserName":"Amy2","classRoomName":null,"studentNum":0,"subjectId":"1135436108592795650","subjectName":null,"courseType":3,"courseTypeName":null,"courseMode":1,"nearTrialClassSyllabus":null,"classOrTrialClass":2,"foreignTeacherType":null,"foreignTeacherPrice":null,"feiboSyllabusOrderNum":null});
	
	},
	created : function() {
		vm = this;
		dict = tool.getItem(lsKey.dict,true);
		vm.statusMap = tool.parseDict(dict["audition_status"]);
	}
}

</script>

<style scoped src="@/style/module/dialog.css"></style>
<style scoped src="@/style/module/table.css"></style>
<style scoped>

	.panel {
		width: 9rem;
	}
	.form {
		padding: 0 0.3rem 0.4rem 0.3rem;
		color: #666666;
	}
	.thead td{
		font-size: 0.16rem;
		color: #999999;
	}
	.span_btn {
		cursor: pointer;
		color: #3885f8;
	}
	.created_img {
		width: 0.2rem;
		height: 0.2rem;
		vertical-align: middle;
		position: relative;
		top: -0.02rem
	}
	
	.create_btn {
		float: right;
	    height: 0.4rem;
	    width: 1.6rem;
	    background: #3885f8;
	    border-radius: 0.1rem;
	    text-align: center;
	    color: #ffffff;
	    margin-right: 0.1rem;
	    margin-bottom: 0.15rem;
	    line-height: 0.4rem;
	    font-size: 0.16rem;
	    cursor: pointer;
	}
	.create_btn:hover {
		background-color: rgba(56,133,248,0.8);
	}
</style>